<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>登陆</title>

<link href="__PUBLIC__/admin/css/bootstrap.min.css" rel="stylesheet">
<link href="__PUBLIC__/admin/css/datepicker3.css" rel="stylesheet">
<link href="__PUBLIC__/admin/css/styles.css" rel="stylesheet">

<!--[if lt IE 9]>
<script src="__PUBLIC__/admin/js/html5shiv.js"></script>
<script src="__PUBLIC__/admin/js/respond.min.js"></script>
<![endif]-->

</head>

<body>
	
	<div class="row">
		<div class="col-xs-10 col-xs-offset-1 col-sm-8 col-sm-offset-2 col-md-4 col-md-offset-4">
			<div class="login-panel panel panel-default">
				<div class="panel-heading">登录</div>
				<div class="panel-body">
					<form role="form" action="{:U('Login/login')}" method="POST" id="form1">
						<fieldset>
							<div class="form-group icon">
								<input class="form-control" placeholder="用户名/邮箱" type="text" autofocus="" name="username" id="username">
							</div>
							<div class="form-group icon">
								<input class="form-control" placeholder="密码" type="password" name="password" id="password">
							</div>
							<div class="checkbox">
								<label>
									<input name="remember" type="checkbox" value="记住密码" id="remember">记住密码
								</label>
							</div>
							<button type="submit" class="btn btn-primary">登录</button>
						</fieldset>
					</form>
				</div>
			</div>
		</div><!-- /.col-->
	</div><!-- /.row -->

	<script src="__PUBLIC__/admin/js/jquery-1.11.1.min.js"></script>
	<script src="__PUBLIC__/admin/js/bootstrap.min.js"></script>
	<script src="__PUBLIC__/admin/js/chart.min.js"></script>
	<script src="__PUBLIC__/admin/js/chart-data.js"></script>
	<script src="__PUBLIC__/admin/js/easypiechart.js"></script>
	<script src="__PUBLIC__/admin/js/easypiechart-data.js"></script>
	<script src="__PUBLIC__/admin/js/bootstrap-datepicker.js"></script>
	<script src="__PUBLIC__/admin/js/jquery.validate.min.js"></script>
	<script>
		!function ($) {
			$(document).on("click","ul.nav li.parent > a > span.icon", function(){		  
				$(this).find('em:first').toggleClass("glyphicon-minus");	  
			}); 
			$(".sidebar span.icon").find('em:first').addClass("glyphicon-plus");
		}(window.jQuery);

		$(window).on('resize', function () {
		  if ($(window).width() > 768) $('#sidebar-collapse').collapse('show')
		})
		$(window).on('resize', function () {
		  if ($(window).width() <= 767) $('#sidebar-collapse').collapse('hide')
		})
	</script>
	<!-- 记住密码 -->
	<script>
	// localStorage.setItem("demokey", "http://blog.itjeek.com");
	// var dt = localStorage.getItem("demokey");
	// localStorage.clear();
	$(function(){
		var local=localStorage.getItem("adminRemember");
		if (local=="true") {
			var username=localStorage.getItem("adminName");
			var password=localStorage.getItem("adminPassword");
			$('#username').val(username);
			$('#password').val(password);
			$('#remember').prop("checked",true);
		} else {
			$('#remember').prop("checked",false);
		}
		$('#remember').on("click",function(){
			// alert();
			rememberPw();
		});
	});
	function rememberPw(){
		if ($('#remember').prop("checked")) {
			localStorage.setItem("adminRemember", "true");
			localStorage.setItem("adminName", $('#username').val());
			localStorage.setItem("adminPassword", $('#password').val());
		} else {
			localStorage.clear();
		}
	}
	</script>
	<!-- 登录验证 -->
	<script>
	$(function(){
		$("#form1").validate({
		    rules: {
		      username: {
		      	required:true,
		      	remote:{
                        url: "{:U('Login/ajaxCheckVerifyName')}",
                        type: "post",
                        dataType: "json",
                        data: {},
                        dataFilter: function (data) {
                            if (data=="true") {
                                return true;
                            }
                            else {
                                return false;
                            }
                        }
                    }
		      },
		      password: {
		      	required:true,
		      	remote:{
                        url: "{:U('Login/ajaxCheckVerifyPassword')}",
                        type: "post",
                        dataType: "json",
                        data: {},
                        dataFilter: function (data) {
                            if (data=="true") {
                                return true;
                            }
                            else {
                                return false;
                            }
                        }
                    }
		      }
		    },
		    messages: {
		      username: {
		      	required:"请输入您的用户名",
		      	remote:"用户名不存在"
		      },
		      password:{
		      	required:"请输入您的用户密码",
		      	remote:"用户名或者密码错误"
		      }
		    },
		    // 当验证失败的时候会做的事情
			errorPlacement: function(error, element) { 
				// console.log(error);
				// console.log(element);
				var strFalse='<span class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span>';
				var strTure='<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>';

				element.parents(".form-group").append(strFalse);
				element.parents(".form-group").find(".glyphicon-ok").remove();
				element.parent().append(error);
				element.parents(".form-group").removeClass("has-success");
				element.parents(".form-group").addClass("has-error");
			},success: function(element) {
				// alert(element.html());
				var strFalse='<span class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true"></span>';
				var strTure='<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true"></span>';
				element.parents(".form-group").removeClass("has-error");
				element.parents(".form-group").addClass("has-success");
				element.parents(".form-group").append(strTure);
				element.parents(".form-group").find(".glyphicon-remove").remove();
				element.remove();
			}
		});
	})
	</script>
</body>

</html>
